<template>
    <div class="box">
        <van-row class="rowwb">
            <van-col span="16" class="nhhyhl">
                <h2 style="margin-top: 25%;"></h2>
            </van-col>
            <van-col class="nhhyhl nbj" span="16" style="width:90%;">
                <!-- <img class="bjtss" src="@/assets/image/zgbj.png" alt=""> -->
                <h1 class="zfwfz">日&nbsp照&nbsp边&nbsp检</h1>
                <h1 class="zfwfz">政&nbsp务&nbsp服&nbsp务&nbsp平&nbsp台</h1>
            </van-col>
            <img class="bjt" src="@/assets/image/bf2.png" style="z-index:999; margin:0 auto;" alt="">
            <!-- <img class="bjts" src="@/assets/image/wer.png" style="margin:0 auto;" alt=""> -->
        </van-row>
        <van-row type="flex" justify="center" class="topacbg">
            <van-col span="10" @click="wodsq" style="border-radius:4px -0px -0px 4px; border-right: 2px dashed #dbdbdb;"
                class="wdsq">
                <div class="icons" style="line-height:70px; margin-left:12px;"> <svg t="1697244931358" class="icon"
                        viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4091" width="30"
                        height="30">
                        <path
                            d="M260.256 356.576l204.288-163.968a32 32 0 0 1 52.032 24.96v610.432a32 32 0 0 1-51.968 24.992l-209.92-167.552H96a32 32 0 0 1-32-32v-264.864a32 32 0 0 1 32-32h164.256zM670.784 720.128a32 32 0 0 1-44.832-45.664 214.08 214.08 0 0 0 64.32-153.312 213.92 213.92 0 0 0-55.776-144.448 32 32 0 1 1 47.36-43.04 277.92 277.92 0 0 1 72.416 187.488 278.08 278.08 0 0 1-83.488 198.976zM822.912 858.88a32 32 0 1 1-45.888-44.608A419.008 419.008 0 0 0 896 521.152c0-108.704-41.376-210.848-114.432-288.384a32 32 0 0 1 46.592-43.872c84.16 89.28 131.84 207.04 131.84 332.256 0 127.84-49.76 247.904-137.088 337.728z"
                            fill="#5081F3" p-id="4092"></path>
                    </svg></div>
                <div class="xingmingl">
                    <van-col span="24" style="line-height:50px;" class="mingz1">
                        我的申请
                    </van-col>
                </div>
            </van-col>

            <van-col span="10" @click="xxtx" class="wdsq" style="border-radius:-0px 4px 4px 4px;">
                <van-badge :content="sl">
                    <!-- <div class="child" /> -->
                </van-badge>
                <div class="icons" style="line-height:67px; margin-left:8px;"> <svg t="1697245056129" class="icon"
                        viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11652" width="26"
                        height="26">
                        <path
                            d="M421.691077 83.968V78.769231a78.769231 78.769231 0 0 1 157.538461 0v5.198769c156.711385 27.884308 275.692308 164.824615 275.692308 329.570462v283.254153l96.098462 103.50277a39.384615 39.384615 0 0 1-28.868923 66.166153H78.769231a39.384615 39.384615 0 0 1-28.868923-66.166153l96.098461-103.50277V413.538462a334.887385 334.887385 0 0 1 275.692308-329.570462z m196.923077 821.878154a118.153846 118.153846 0 0 1-236.307692 0h236.307692z"
                            fill="#5081F3" p-id="11653"></path>
                    </svg></div>
                <div class="xingmingl">
                    <van-col span="24" style="line-height:50px;" class="mingz1">
                        消息提醒
                    </van-col>
                </div>
            </van-col>
        </van-row>
        <!-- <div class="kgbj"></div> -->
        <van-swipe class="my-swipe" style="width: 90%;" :autoplay="3000" indicator-color="white">
            <van-swipe-item style="position:relative;"><img lazy-load style="position:absolute;max-width:%100;"
                    src="@/assets/image/lbta.jpg" alt="">
            </van-swipe-item>
            <van-swipe-item style="position:relative;"><img style="position:absolute;max-width:%100;"
                    src="@/assets/image/lbtb.jpg" alt="">
            </van-swipe-item>
            <van-swipe-item style="position:relative;"><img style="position:absolute;max-width:%100;"
                    src="@/assets/image/lbtc.jpg" alt="">
            </van-swipe-item>
            <van-swipe-item style="position:relative;"><img style="position:absolute;max-width:%100;"
                    src="@/assets/image/lbtd.jpg" alt="">
            </van-swipe-item>
            <van-swipe-item style="position:relative;"><img style="position:absolute;max-width:%100;"
                    src="@/assets/image/lbte.jpg" alt="">
            </van-swipe-item>
        </van-swipe>

        <h3 class="kblywlb">可办理业务列表</h3>
        <van-row class="boxa">
            <van-col span="24" class="boxw" @click="qyrz">
                <div class="icons">
                    <!-- <svg t="1696906035099" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="14247" width="50" height="50">
                        <path
                            d="M449.530286 577.163429l290.102857-289.022858c9.389714-9.355429 24.585143-9.325714 33.940571 0.062858 9.355429 9.390857 9.325714 24.586286-0.062857 33.941714L466.684571 627.828571l-0.030857 0.030858c-9.317714 9.282286-24.350857 9.325714-33.722285 0.153142L252.390857 452.043429c-9.491429-9.251429-9.686857-24.445714-0.434286-33.938286 9.251429-9.491429 24.445714-9.686857 33.938286-0.434286l163.634286 159.492572z m511.515428-65.278858c0.037714 0.726857 0.042286 1.461714 0.013715 2.202286-2.094857 53.195429-11.216 100.028571-27.513143 140.445714-0.954286 2.365714-5.717714 14.504-7.205715 18.213715-3.451429 8.603429-6.693714 16.270857-10.288 24.179428-9.486857 20.873143-20.395429 41.022857-33.851428 61.557715-35.042286 53.482286-83.862857 104.043429-150.857143 151.296-57.744 40.728-127.466286 77.768-210.524571 110.561142a23.938286 23.938286 0 0 1-8.758858 1.683429 23.933714 23.933714 0 0 1-8.945142-1.682286c-83.058286-32.793143-152.780571-69.834286-210.525715-110.562285-66.994286-47.251429-115.813714-97.813714-150.857143-151.294858-13.454857-20.534857-24.363429-40.685714-33.851428-61.558857-3.593143-7.908571-6.835429-15.574857-10.285714-24.179428-1.489143-3.709714-6.251429-15.846857-7.206858-18.212572-16.251429-40.304-25.366857-86.987429-27.494857-139.998857a24.075429 24.075429 0 0 1-0.608-5.392v-400c0-3.019429 0.557714-5.908571 1.576-8.571428 1.822857-9.385143 9.193143-17.158857 19.161143-19.020572L488.297143 5.876571a129.142857 129.142857 0 0 1 47.408 0l405.273143 75.674286c11.318857 2.114286 19.288 11.851429 19.589714 22.913143 0.377143 1.690286 0.576 3.446857 0.576 5.250286v400c0 0.731429-0.033143 1.456-0.097143 2.171428z m-47.870857-0.912A24.393143 24.393143 0 0 1 913.142857 509.714286V125.182857L526.893714 53.062857a81.142857 81.142857 0 0 0-29.787428 0L110.285714 125.290286v382.626285c0.307429 1.384 0.496 2.816 0.553143 4.282286 1.888 47.954286 9.96 89.396571 24.067429 124.384 1.060571 2.628571 5.845714 14.822857 7.238857 18.294857 3.2 7.979429 6.170286 15.002286 9.435428 22.186286 8.514286 18.731429 18.260571 36.737143 30.301715 55.113143 31.736 48.434286 76.322286 94.611429 138.373714 138.377143 52.514286 37.04 115.992 71.100571 191.710857 101.638857 75.718857-30.538286 139.196571-64.598857 191.712-101.638857 62.051429-43.765714 106.638857-89.942857 138.373714-138.377143 12.041143-18.377143 21.788571-36.382857 30.302858-55.113143 3.265143-7.184 6.234286-14.206857 9.434285-22.186286 1.394286-3.474286 6.179429-15.666286 7.238857-18.294857 14.107429-34.987429 22.179429-76.430857 24.068572-124.384 0.014857-0.411429 0.041143-0.820571 0.077714-1.226286z"
                            fill="#1296db" p-id="14248"></path>
                    </svg> -->
                    <img src="@/assets/image/aaa (6).png" alt="" style=" margin-left:20px;width:50px; height:50px;">
                </div>
                <div class="xingmingl" style="margin-left:40px">
                    <van-col span="24" style="font-weight:bold;" class="mingz1">
                        企业认证
                    </van-col>
                    <van-col span="24" class="mingz2">港口企业备案
                    </van-col>
                </div>
            </van-col>
        </van-row>
        <van-row class="boxa">
            <van-col span="24" class="boxw" @click="wycg">
                <div class="icons"><img src="@/assets/image/aaa (7).png" alt=""
                        style=" margin-left:20px;width:50px; height:50px;"></div>
                <div class="xingmingl" style="margin-left:40px">
                    <van-col span="24" style="font-weight:bold;" class="mingz1">
                        我要出国
                    </van-col>
                    <van-col span="24" class="mingz2">我要出国
                    </van-col>
                </div>
            </van-col>
        </van-row>
        <van-row class="boxa">
            <van-col span="24" class="boxw" @click="tztshw">
                <div class="icons"><img src="@/assets/image/aaa (5).png" alt=""
                        style="  margin-left:20px;width:50px; height:50px;"></div>
                <div class="xingmingl" style="margin-left:40px">
                    <van-col span="24" style="font-weight:bold;" class="mingz1">
                        特殊货物
                    </van-col>
                    <van-col span="24" class="mingz2">优先验放“快捷通道”</van-col>
                </div>
            </van-col>

        </van-row>
        <van-row class="boxa">
            <van-col span="24" class="boxw" @click="call">
                <a href="" v-show="false" ref="tels"></a>
                <div class="icons"><img src="@/assets/image/aaa (2).png" alt=""
                        style="  margin-left:20px;width:50px; height:50px;"></div>
                <div class="xingmingl" style="margin-left:40px">
                    <van-col span="24" style="font-weight:bold;" class="mingz1">
                        船员救助
                    </van-col>
                    <van-col span="24" class="mingz2">国际航行船舶船员救助“紧急通道”
                    </van-col>
                </div>
            </van-col>
        </van-row>

        <van-row class="boxa">
            <van-col span="24" class="boxw" @click="blcrj">
                <div class="icons"><img src="@/assets/image/aaa (3).png" alt=""
                        style=" margin-left:20px;width:50px; height:50px;"></div>
                <div class="xingmingl" style="margin-left:40px">
                    <van-col span="24" style="font-weight:bold;" class="mingz1">
                        行政许可
                    </van-col>
                    <van-col span="24" class="mingz2">边检行政许可办理流程
                    </van-col>
                </div>
            </van-col>
        </van-row>
        <van-row class="boxa">
            <van-col span="24" class="boxw" @click="wyjb">
                <div class="icons"> <img src="@/assets/image/aaa (4).png" alt=""
                        style="  margin-left:20px;width:50px; height:50px;"></div>
                <div class="xingmingl" style="margin-left:40px">
                    <van-col span="24" style="font-weight:bold;" class="mingz1">
                        我要举报
                    </van-col>
                    <van-col span="24" class="mingz2">涉嫌非法出入境等违法犯罪活动
                    </van-col>
                </div>
            </van-col>
        </van-row>



        <div class="ddd">
            <div class="bq">--日照出入境边防检查站--</div>
        </div>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                // 爱山东
                appmark: "sdzwapp",
                appword: "aKd20dbGdFvmuwrt",
                userType: "1", //用户类型  1个人   2法人
                userToken: "",
                appid: "Embmzckm",
                // 爱山东
                container: null,
                xxts: "3",
                sl: "",
            };
        },
        created() {
            // this.wdsq()
        },
        mounted() {
            this.wdsq()
            this.container = this.$refs.container;
        },
        methods: {
            tztshw() {
                this.$router.push('/tshw')
            },
            wycg() {
                this.$router.push('/wycg')
            },
            wyjb() {
                this.$router.push('/dyy')
            },
            call() {
                this.$refs.tels.href = `tel://06337900028`
                this.$refs.tels.click()
            },
            qyrz() {
                this.$router.push('/qyrz')
            },
            blcrj() {
                this.$router.push('/blcrj')
            },
            wodsq() {
                this.$router.push('/wdsq')
            },
            xxtx() {
                this.$router.push('/xxtx')
            },
            wdsq() {
                var sfz = window.sessionStorage.getItem("sfz")
                // var sfz = "411122200010288050"
                var that = this
                console.log("sfz", sfz);
                if (sfz == null || sfz == "") {
                    that.sl = 0
                } else {
                    var jmqsjtj = JSON.stringify({
                        //入参内容
                        "sfz": sfz,
                        // sfz: "411122200010288050"
                    })
                    var jmhsjtj = SM.encrypt(jmqsjtj,
                        //公钥
                        "04ea6327e6abd7977bd20480e742af92793888165475392cc7ce10f8930e0ad6b7538756fcd44a13c6caacc724bf5544d5e0d8f4a9d7892ee8337377ddc3bafee0"
                    );
                    // var appid = that.appid;
                    var appid = "Embmzckm";
                    var interfaceid = 'wdsl';
                    var interfacecontent = jmhsjtj
                    var fromport = '2';
                    var signurl = 'https://' + urldomaincreatesign;
                    var gatewayurl = 'https://' + urldomaingateway;
                    vaildInterfacefn(appid, interfaceid, interfacecontent, fromport, signurl, gatewayurl).then(
                        value => {
                            //私钥
                            var jjjsjtj = SM.decrypt(value,
                                "6636756e69f8276c514919d04eaf928498b443bfb783e8fe6fa6977056c4d90b");
                            var list = JSON.parse(jjjsjtj)
                            console.log(list);
                            that.sl = list.result
                            if (that.sl == 0) {
                                that.value = true
                            }
                        })
                }
                // var jmqsjtj = JSON.stringify({
                //     //入参内容
                //     "sfz": sfz,
                //     // sfz: "411122200010288050"
                // })
                // var jmhsjtj = SM.encrypt(jmqsjtj,
                //     //公钥
                //     "04ea6327e6abd7977bd20480e742af92793888165475392cc7ce10f8930e0ad6b7538756fcd44a13c6caacc724bf5544d5e0d8f4a9d7892ee8337377ddc3bafee0"
                // );
                // // var appid = that.appid;
                // var appid = "Embmzckm";
                // var interfaceid = 'wdsl';
                // var interfacecontent = jmhsjtj
                // var fromport = '2';
                // var signurl = 'https://' + urldomaincreatesign;
                // var gatewayurl = 'https://' + urldomaingateway;
                // vaildInterfacefn(appid, interfaceid, interfacecontent, fromport, signurl, gatewayurl).then(value => {
                //     //私钥
                //     var jjjsjtj = SM.decrypt(value,
                //         "6636756e69f8276c514919d04eaf928498b443bfb783e8fe6fa6977056c4d90b");
                //     var list = JSON.parse(jjjsjtj)
                //     console.log(list);
                //     that.sl = list.result
                //     if (that.sl == 0) {
                //         that.value = true
                //     }
                // })
            }
        }
    };
</script>

<style scoped lang="less">
    .child {
        width: 40px;
        height: 40px;
        background: #f2f3f5;
        border-radius: 4px;
    }

    .box {
        background-color: rgb(247, 247, 247);
    }

    .kgbj {
        width: 100%;
        height: 50px;
        background-color: aqua;
    }

    .van-badge {
        position: absolute;
        left: 17%;

    }

    .van-swipe[data-v-c776710e] {
        height: 220px;
        width: 90%;
        margin: 0 auto;
    }

    .van-swipe-item {
        width: 375px;
        height: 150px;
    }

    img {
        width: 100%;
        height: 220px;
    }

    .van-swipe {
        height: 220px;
    }

    .ddd {
        margin-top: 6%;
    }

    .bq {
        width: 100vw;
        display: flex;
        justify-content: center;
        font-size: 12px;
        color: rgb(136, 140, 144);
    }

    span {
        font-size: 17px;
        color: rgb(69, 70, 71);
    }

    .rowwb {
        width: 100%;
        // background-color: #355B9A;
        background-image: url(@/assets/image/qwea.png);
        box-sizing: border-box;
        // background:no-repeat center top / 100% 100% ;
        overflow: hidden;
        // background-image:linear-gradient(to top,rgba(255,255,255,1),rgba(255,255,255,1)), url(@/assets/image/qwe.png) ;
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        // background-size: 335px;

        height: 320px;

        .nhhyhl {
            margin-left: 5%;
            color: #0f0c0c;
            position: relative;
            top: 18%;
            text-align: center;
        }

        .nbj {
            padding-bottom: 5px;
        }
    }

    .icons {
        // border: #2C569A solid 1px;
        width: 50px;
        height: 50px;
    }

    .xingmingl {
        height: 50px;
        width: 100%;
        margin-left: 6%;
        // border: #2C569A solid 1px;
    }

    .boxw {
        display: flex;
        align-items: center;
        width: 90%;
        height: 70px;
        margin-left: 5%;
        margin-top: 3%;
        line-height: 27px;
        background-color: #F4F9FF;
        border-radius: 4%;
    }

    .boxa {
        margin: 0 auto;
        width: 100%;
        // border: #E8E8E8 1px solid;
        border-radius: 5px;
        // background-color: #FAFAFA;
        // margin-top: 4%;
    }

    .icons[data-v-c776710e] {
        // margin-left: 20px;

    }

    .kblywlb {
        width: 90%;
        margin: 15px auto;
    }

    .mingz2 {
        font-size: 16px;
        color: #747474;
    }

    .wdsq {
        display: flex;
        position: relative;
        // top: -25px;
        background-color: #ffffff;
        border-radius: 5px;

    }

    .topacbg {
        // top: 30px;
        width: 90%;
        margin: 0 auto;
        position: relative;
        top: -25px;
    }

    .my-swipe {
        border-radius: 5px;
        margin: 0 auto;
    }

    .van-swipe[data-v-c776710e][data-v-c776710e] {
        width: 80%;
    }

    .van-col--10 {
        width: 50%;
    }

    .bjt {
        width: 110px;
        position: absolute;
        height: 110px;
        top: 22px;
        left: 36%;
        // margin: 0 auto;
    }

    .bjts {
        width: 112px;
        position: absolute;
        height: 110px;
        top: 18.5px;
        left: 36.5%;
    }

    .bjtss {
        margin-top: 3%;
        width: 81%;
        height: 60%;
    }

    .zfwfz {
        // position: absolute;
        font-size: 40px;
        margin-top: 4%;
        color: #F4F9FF;
    }
</style>